// pages/appointment/appointment.js
import { get, post } from "../../api/request";
Page({
  data: {
    // 表单数据
    formData: {
      province: '新疆',
      examType: '南疆单列考生',
      subject: '文科',
      area: '乌鲁木齐市',
      score: '',
      rank: '',
      appointmentDate: '请选择预约时间',
      phone: '',
      studentName: '',
      gender: '请选择考生性别' // 默认选择男性
    },
    // 省份选项
    provinces: ['新疆'],
    // 报考类型选项
    examTypes: ['南疆单列考生', '普通考生', '艺术考生', '体育考生'],
    // 科目选项
    subjects: ['文科', '理科', '综合改革'],
    // 地区选项
    areas: ['伊宁市', '乌鲁木齐市', '克拉玛依市', '吐鲁番市'],
    provincesshow: false,
    examTypeShow: false,
    subjectShow: false,
    areaShow: false,
    dateShow: false,
    calendarData: [],
    areasWithValue: [],
    examTypesData: []
  },

  onLoad(options) {
    // 页面加载时的处理逻辑
  },

  onShow() {
    this.requestItem()
    // 页面显示时的处理逻辑
  },

  requestItem() {
    get('/index/area').then(res => {
      console.log('区域', res);

      // 解析返回的数据，提取每个省的城市信息
      if (res && res.data && Array.isArray(res.data)) {
        const provinces = res.data.map(province => {
          // 提取当前省份的信息
          const { label, value } = province;

          // 提取该省份下的城市信息（不包括县级行政区）
          const cities = province.children ? province.children.map(city => ({
            label: city.label,
            value: city.value
          })) : [];

          return { label, value, cities };
        });

        // 特别提取新疆的城市
        const xinjiang = provinces.find(p => p.label === '新疆');
        if (xinjiang && xinjiang.cities) {
          // 保存完整城市信息到 data 中
          this.setData({
            areasWithValue: xinjiang.cities,  // 保存完整的城市信息（包括label和value）
            areas: xinjiang.cities.map(city => city.label)  // 只保存城市名称用于显示
          });
          // 检查乌鲁木齐市是否在列表中
          const hasUrumqi = xinjiang.cities.some(city => city.label === '乌鲁木齐市');
          // 如果乌鲁木齐市在列表中，确保它是当前选择的城市
          if (hasUrumqi && this.data.formData.area !== '乌鲁木齐市') {
            this.setData({
              'formData.area': '乌鲁木齐市'
            });
          }
          console.log('新疆的城市列表：', xinjiang.cities);
        }
      }
    });

    get('/index/enum_list?key=type_app').then(res => {
      console.log('报考类型', res);

      // 检查后端返回的数据是否有效
      if (res && res.code === 200 && res.data && Array.isArray(res.data)) {
        // 提取报考类型的标签和值
        const examTypesData = res.data;
        const examTypesLabels = examTypesData.map(item => item.label);

        // 更新页面数据
        this.setData({
          examTypesData: examTypesData,  // 保存完整的数据（包含label和value）
          examTypes: examTypesLabels,    // 仅保存标签用于显示
        });

        // 如果当前选择的报考类型不在新列表中，则设置默认值
        if (examTypesLabels.length > 0 && !examTypesLabels.includes(this.data.formData.examType)) {
          this.setData({
            'formData.examType': examTypesLabels[0]
          });
        }
      }
    });
  },
  // 选择省份
  handleProvinceChange(e) {
    const value = e.detail.value;
    this.setData({
      'formData.province': this.data.provinces[value]
    });
  },

  // 选择报考类型
  handleExamTypeChange(e) {
    const value = e.detail.value;
    this.setData({
      'formData.examType': this.data.examTypes[value]
    });
  },

  // 选择科目
  handleSubjectChange(e) {
    const value = e.detail.value;
    this.setData({
      'formData.subject': this.data.subjects[value]
    });
  },

  // 选择地区
  handleAreaChange(e) {
    const value = e.detail.value;
    this.setData({
      'formData.area': this.data.areas[value]
    });
  },

  // 选择日期
  handleDateChange(e) {
    this.setData({
      'formData.appointmentDate': e.detail.value
    });
  },

  // 输入电话
  handlePhoneInput(e) {
    this.setData({
      'formData.phone': e.detail.value
    });
  },

  // 验证手机号
  validatePhone(phone) {
    const phoneReg = /^1[3-9]\d{9}$/;
    return phoneReg.test(phone);
  },

  // 表单验证
  validateForm() {
    const { formData } = this.data;

    if (!formData.province) {
      wx.showToast({
        title: '请选择高考省份',
        icon: 'none'
      });
      return false;
    }

    if (!formData.examType) {
      wx.showToast({
        title: '请选择报考类型',
        icon: 'none'
      });
      return false;
    }

    if (!formData.subject) {
      wx.showToast({
        title: '请选择科目',
        icon: 'none'
      });
      return false;
    }

    if (!formData.area) {
      wx.showToast({
        title: '请选择所在地区',
        icon: 'none'
      });
      return false;
    }

    if (!formData.appointmentDate || formData.appointmentDate === '请选择预约时间') {
      wx.showToast({
        title: '请选择预约时间',
        icon: 'none'
      });
      return false;
    }

    if (!formData.studentName) {
      wx.showToast({
        title: '请输入考生姓名',
        icon: 'none'
      });
      return false;
    }

    if (!formData.gender) {
      wx.showToast({
        title: '请选择考生性别',
        icon: 'none'
      });
      return false;
    }

    if (!this.validatePhone(formData.phone)) {
      wx.showToast({
        title: '请输入正确的手机号',
        icon: 'none'
      });
      return false;
    }

    if (!formData.score) {
      wx.showToast({
        title: '请输入高考成绩',
        icon: 'none'
      });
      return false;
    }

    if (!formData.rank) {
      wx.showToast({
        title: '请输入高考排名',
        icon: 'none'
      });
      return false;
    }

    return true;
  },

  // 点击表单项
  handleFormItemClick(e) {
    const { type } = e.currentTarget.dataset;
    switch (type) {
      case 'province':
        wx.showToast({
          title: '暂时未开放',
          icon: 'error',
          duration: 2000
        });
        // this.showProvinceSelector();
        break;
      case 'examType':
        this.showExamTypeSelector();
        break;
      case 'subject':
        this.showSubjectSelector();
        break;
      case 'area':
        this.showAreaSelector();
        break;
      case 'date':
        this.showDatePicker();
        break;
    }
  },

  // 显示省份选择器
  showProvinceSelector() {
    this.setData({
      provincesshow: true
    });
  },

  // 关闭弹窗
  onClose() {
    this.setData({
      provincesshow: false,
      examTypeShow: false,
      subjectShow: false,
      areaShow: false,
      dateShow: false
    });
  },

  // 处理省份选择
  handleProvinceSelect(e) {
    const province = e.currentTarget.dataset.province;
    this.setData({
      'formData.province': province,
      provincesshow: false
    });

    // 可选：关闭后的回调，例如触发表单验证等
    this.validateForm();
  },

  // 显示报考类型选择器
  showExamTypeSelector() {
    this.setData({
      examTypeShow: true
    });
  },

  // 关闭报考类型弹窗
  onExamTypeClose() {
    this.setData({
      examTypeShow: false
    });
  },

  // 选择报考类型
  handleExamTypeSelect(e) {
    const examType = e.currentTarget.dataset.examType;

    // 找到对应的value值
    const selectedType = this.data.examTypesData.find(item => item.label === examType);
    const typeValue = selectedType ? selectedType.value : null;

    this.setData({
      'formData.examType': examType,
      'formData.examTypeValue': typeValue,  // 存储value值，用于提交表单
      examTypeShow: false
    });
  },

  // 显示科目选择器
  showSubjectSelector() {
    this.setData({
      subjectShow: true
    });
  },

  // 关闭科目弹窗
  onSubjectClose() {
    this.setData({
      subjectShow: false
    });
  },

  // 选择科目
  handleSubjectSelect(e) {
    const subject = e.currentTarget.dataset.subject;
    this.setData({
      'formData.subject': subject,
      subjectShow: false
    });
  },

  // 显示地区选择器
  showAreaSelector() {
    this.setData({
      areaShow: true
    });
  },

  // 关闭地区弹窗
  onAreaClose() {
    this.setData({
      areaShow: false
    });
  },

  // 选择地区
  handleAreaSelect(e) {
    const areaLabel = e.currentTarget.dataset.area;
    this.setData({
      'formData.area': areaLabel,
      areaShow: false
    });

    // 查找并打印对应的城市value
    const selectedCity = this.data.areasWithValue.find(city => city.label === areaLabel);
    if (selectedCity) {
      console.log('选择的城市：', selectedCity.label, '城市代码：', selectedCity.value);
    }
  },

  // 生成日历数据 - 修改为只显示6月和7月
  generateCalendarData() {
    const currentYear = new Date().getFullYear();
    const calendarData = [];

    // 只生成6月和7月的数据
    for (let month = 5; month <= 6; month++) { // 月份从0开始，5表示6月，6表示7月
      const targetMonth = new Date(currentYear, month, 1);
      const monthData = this.generateMonthData(targetMonth);
      calendarData.push(monthData);
    }

    this.setData({ calendarData });
  },

  // 生成某月的日历数据
  generateMonthData(date) {
    const year = date.getFullYear();
    const month = date.getMonth();
    const daysInMonth = new Date(year, month + 1, 0).getDate();
    const startDay = new Date(year, month, 1).getDay(); // 0 = 周日

    const days = [];
    const today = new Date();

    // 每月的日期数据
    for (let i = 1; i <= daysInMonth; i++) {
      const fullDate = `${year}年${month + 1}月${i}日`;
      const dateObj = new Date(year, month, i);

      // 设置日期状态
      let status = 'disabled';
      let remain = 0;

      // 只启用6月10-30日和7月1-15日
      if (dateObj >= today) {
        if ((month + 1 === 6 && i >= 10 && i <= 30) || (month + 1 === 7 && i >= 1 && i <= 15)) {
          // 示例：设置某些日期为已满或可预约
          if (month + 1 === 6 && i === 15) {
            status = 'full';
            remain = 0;
          } else if (month + 1 === 6 && i === 20) {
            status = 'full';
            remain = 0;
          } else {
            status = 'available';
            remain = 15; // 默认余量

            // 为不同日期设置不同的余量，增加真实感
            if (i % 3 === 0) remain = 8;
            else if (i % 5 === 0) remain = 12;
            else if (i % 7 === 0) remain = 5;
          }
        }
      }

      // 选中当前已选择的日期
      const selected = fullDate === this.data.formData.appointmentDate &&
        this.data.formData.appointmentDate !== '请选择预约时间';

      days.push({
        day: i,
        fullDate: fullDate,
        status: status,
        remain: remain,
        selected: selected,
        dateKey: `${year}-${month + 1}-${i}`
      });
    }

    // 计算月底需要的空白填充数量，使最后一行也是完整的
    const totalDays = startDay + daysInMonth;
    const endPadding = totalDays % 7 === 0 ? 0 : 7 - (totalDays % 7);

    return {
      title: `${year}年 ${month + 1}月`,
      days: days,
      startDay: startDay,
      endPadding: endPadding,
      monthKey: `${year}-${month + 1}`
    };
  },

  // 显示日期选择器
  showDatePicker() {
    this.generateCalendarData(); // 生成日历数据
    this.setData({
      dateShow: true
    });
  },

  // 处理日期选择
  handleDateSelect(e) {
    const date = e.currentTarget.dataset.date;

    // 确保选择的日期有效（不是默认提示文本）
    if (!date || date === '请选择预约时间') {
      wx.showToast({
        title: '请选择有效日期',
        icon: 'none'
      });
      return;
    }

    // 更新所有日历数据中的选中状态
    const calendarData = this.data.calendarData.map(month => {
      const updatedDays = month.days.map(day => {
        return {
          ...day,
          selected: day.fullDate === date
        };
      });

      return {
        ...month,
        days: updatedDays
      };
    });

    this.setData({
      'formData.appointmentDate': date,
      calendarData: calendarData
    });

    // 延迟关闭，让用户看到选中效果
    setTimeout(() => {
      this.setData({
        dateShow: false
      });
    }, 200);
  },

  // 联系客服
  handleServiceClick() {
    wx.showModal({
      title: '联系客服',
      content: '是否拨打客服电话？',
      success: (res) => {
        if (res.confirm) {
          wx.makePhoneCall({
            phoneNumber: '400-xxx-xxxx' // 替换为实际的客服电话
          });
        }
      }
    });
  },

  // 提交预约
  handleSubmit() {
    if (!this.validateForm()) {
      return;
    }

    // 再次验证预约时间
    if (this.data.formData.appointmentDate === '请选择预约时间') {
      wx.showToast({
        title: '请选择预约时间',
        icon: 'none'
      });
      return;
    }

    wx.showLoading({
      title: '提交中...'
    });

    // 准备接口需要的参数
    const { formData } = this.data;

    // 获取城市代码
    const selectedCity = this.data.areasWithValue.find(city => city.label === formData.area);

    // 如果无法找到对应的城市代码，但当前选择的是乌鲁木齐市，则使用乌鲁木齐市的默认代码
    let cityCode;
    if (selectedCity) {
      cityCode = selectedCity.value;
    } else if (formData.area === '乌鲁木齐市') {
      cityCode = 650100; // 乌鲁木齐市的代码，请根据实际情况调整
    } else {
      cityCode = 0;
    }

    // 转换性别 - 接口要求 0:男 1:女
    const genderCode = formData.gender === '男' ? 0 : 1;

    // 转换科目 - 接口要求 0:理科 1:文科
    let subjectCode = 0; // 默认理科
    if (formData.subject === '文科') {
      subjectCode = 1;
    } else if (formData.subject === '综合改革') {
      // 综合改革可能需要特殊处理，这里先暂时定为0，根据实际需求调整
      subjectCode = 2;
    }

    // 构建请求体，使用后端返回的examTypeValue
    const requestData = {
      user_name: formData.studentName,
      user_gender: genderCode,
      phone: formData.phone,
      province: 650000, // 新疆的代码
      city: cityCode,
      subjects: subjectCode,
      grades: parseInt(formData.score),
      test_region: parseInt(formData.rank),
      appointment: formData.appointmentDate,
      type_appli: formData.examTypeValue, // 修改参数名为 type_appli
    };

    console.log('提交的预约数据:', requestData);
    post('/user/reservation', requestData).then(res => {
      wx.hideLoading();
      if (res.code === 200) {
        wx.showToast({
          title: res.message,
          icon: 'success',
          duration: 2000
        });
        setTimeout(() => {
          wx.navigateTo({
            url: '/pages/success/success'
          });
        }, 2000);
      } else {
        wx.showToast({
          title: res.message,
          icon: 'error',
          duration: 2000
        });
      }
    })
  },

  // 添加处理高考成绩输入的函数
  handleScoreInput(e) {
    this.setData({
      'formData.score': e.detail.value
    });
  },

  // 添加处理高考排名输入的函数
  handleRankInput(e) {
    this.setData({
      'formData.rank': e.detail.value
    });
  },

  // 添加处理考生姓名输入的函数
  handleNameInput(e) {
    this.setData({
      'formData.studentName': e.detail.value
    });
  },

  // 添加处理性别选择的函数
  handleGenderChange(e) {
    this.setData({
      'formData.gender': e.detail
    });
  }
});